/**
 * Created by MingIr on 2017/1/19.
 * @author:bjzhang
 */
import React,{ Component } from 'react';
import {
    View,
    ScrollView,
    StyleSheet,
    Text,
    Image,
    TouchableOpacity,
} from 'react-native';
import PHead from '../module/header';
export default class FindEventDetail extends Component{
    constructor(props){
        super(props);
    }
    componentWillUnmount(){
        // console.log('goback');
        let { params } = this.props.navigation.state;
        typeof params.refresh == 'function' && params.refresh();
    }
    eventDetail(){
        this.props.navigation.navigate('JoinNewEvent',{ eventId: this.eventId });
    }
    render(){
        let { params } = this.props.navigation.state;
        let bag = params.bag;
        this.eventId = bag.eventId;
        return(
            <View style={[styles.container,styles.spaceBetween]}>
                <PHead title="一个特别的礼物" onBackEvent={()=>{ this.props.navigation.goBack();}}  leftIcon={require('../../icon/camera/camera_icon_back.png')} rightIcon={require('../../icon/btn/btn_wechat.png')}/>
                <View style={[styles.container,styles.spaceBetween,styles.containerPadding]}>
                    <View style={[styles.headingWrap]}>
                        <View style={styles.headingWrap}>
                            <Image style={styles.headerImg} source={{uri:bag.avatar,method:'GET',header:{ Pragma:'no-cache'},body:'暂无'}}></Image>
                            <Text style={styles.nickNameTx}>{bag.nickName}</Text>
                        </View>
                        <Text style={styles.timeTx}>{bag.createTime}</Text>
                    </View>
                    <View style={[styles.container,{justifyContent:'center',alignItems:'center'}]}>
                        <View style={styles.contentWrap}>
                            <Image source={require('../../icon/btn/btn_shopping.png')}></Image>
                            <Text style={{ fontSize:36,color:'#5F6484', textAlign:'center', }}>{bag.title}</Text>
                            <Text style={{ fontSize:15,color:'#8C959F',marginTop:10, }}>领取码：{ bag.code }</Text>
                            <Text style={{ fontSize:15,color:'#8C959F',marginTop:30, }}>{ bag.message }</Text>
                        </View>
                        <View>
                            <TouchableOpacity activeOpacity={.7}onPress={this.eventDetail.bind(this)} style={styles.lookDetailButton}>
                                <Text style={styles.lookDetailButtonTx}>查看详情</Text>
                            </TouchableOpacity>
                        </View>
                    </View>
                    <View style={styles.likeWrap}>
                        <Image style={styles.likeImage}
                               resizeMode={Image.resizeMode.cover}
                               source={require('../../icon/common/icon_like_pressed.png')}/>
                    </View>
                </View>
            </View>
        );
    }
}

const styles = StyleSheet.create({
    container:{
        flex:1,
        flexDirection:'column',
        backgroundColor:'#fff',
    },
    containerPadding:{
        paddingLeft:15,
        paddingRight:15,
        paddingTop:10,
    },
    spaceBetween:{
        justifyContent:'space-between',
    },
    headingWrap:{
        flexDirection:'row',
        justifyContent:'space-between',
        alignItems:'center',
    },
    headerImg:{
        width:29,
        height:29,
        borderRadius:29,
        overlayColor:'transparent',
    },
    nickNameTx:{
        fontSize:15,
        color:'#8C959F',
        marginLeft:10,
    },
    timeTx:{
        color:'#8C959F',
        fontSize:12,
    },
    likeWrap:{
        alignItems:'center',
        marginBottom:27,
    },
    likeImage:{
        width:49,
        height:49,
    },
    contentWrap:{
        alignItems:'center',
    },
    lookDetailButton:{
        width:131,
        height:38,
        backgroundColor:'#43CBFE',
        marginTop:93,
        paddingTop:10,
        paddingBottom:10,
        borderRadius:3,
        alignItems:'center',
    },
    lookDetailButtonTx:{
        color:'#fff',
        fontSize:15,
    }
});